<template>
  <view class="navbar">
    <view class="topInfo">
      <view class="searchCoceral">
        <u-search
          placeholder="搜索商品"
          v-model="findCoceralVal"
          :show-action="false"
          shape="square"
          disabled
          placeholderColor="#969799"
          bgColor="#ffffff"
          @click="onSearch"
        ></u-search>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  name: 'CustomNavbar',
  data() {
    return {
      findCoceralVal: ''
    };
  },
  methods: {
    onSearch() {
      // 直接在组件内部进行页面跳转
      uni.navigateTo({
        url: '/package/goodsList/indextwo'
      });
    }
  }
};
</script>

<style lang="less">
.navbar {
	  width: 100%;
	  background: #f9f9f9;
	  z-index: 222;
	  .topInfo {
	    width: 100%;
		height: 100rpx;
	    display: flex;
	    align-items: center;
	    .searchCoceral {
			width: 95%;
			margin: 0 auto;
			border-radius: 10rpx;
	      ::v-deep .u-search {
	        width: 100%;
	        height: 20px;
	      }
	    }
	  }
	}
</style>